<template>
    <div class="header-top-wrap">
        <div class="container custom-container">
          <div class="row align-items-center">
            <div class="col-md-7">
              <div class="header-top-left">
                <ul>
                  <li class="header-top-lang">
                    <div class="dropdown">
                      <button
                        class="dropdown-toggle"
                        type="button"
                        id="dropdownMenuButton2"
                        data-toggle="dropdown"
                        aria-haspopup="true"
                        aria-expanded="false"
                      >
                    简体中文
                      </button>
                      <div
                        class="dropdown-menu"
                        aria-labelledby="dropdownMenuButton2"
                      >
                        <a href="#"  @click.prevent="" class="dropdown-item">English</a>
                        <a href="#" @click.prevent="" class="dropdown-item">日本語</a>
                      
                      </div>
                    </div>
                  </li>
                  <li class="header-top-currency">
                    <div class="dropdown">
                      <button
                        class="dropdown-toggle"
                        type="button"
                        id="dropdownMenuButton3"
                        data-toggle="dropdown"
                        aria-haspopup="true"
                        aria-expanded="false"
                      >
                      {{$t('money.CNY')}} - {{$t('money.USD')}}
                      </button>
                      <div
                        class="dropdown-menu"
                        aria-labelledby="dropdownMenuButton3"
                      >
                        <a class="dropdown-item" href="index.html"
                          >{{$t('money.CNY')}} - {{$t('money.JPY')}}</a
                        >
                        <a class="dropdown-item" href="index.html"
                          >{{$t('money.CNY')}} -{{$t('money.TWD')}}</a
                        >
                        <a class="dropdown-item" href="index.html"
                          >{{$t('money.CNY')}} -{{$t('money.EUR')}}</a
                        >
                      </div>
                    </div>
                  </li>
                  <li class="header-work-time">
                   {{$t('head.Working_time')}}: <span> {{$t('day.one')}} <span style="color: greenyellow;">~</span> {{$t('day.six')}} : 8:00 - 21:00</span>
                  </li>
                </ul>
              </div>
            </div>
            <div class="col-md-5">
              <div class="header-top-right">
                <ul>
                  <li v-if="ifLogin"><span style="color: green;">{{customer.nickname}}</span> </li>
                  <li><a href="about-us.html">{{$t('team.About_Us')}}</a></li>
                  <li><a href="contact.html">{{$t('team.Contact')}}</a></li>
                  <li><a href="contact.html">{{$t('team.FAQ')}}</a></li>
                </ul>
              </div>
            </div>
          </div>
        </div>
      </div>
</template>

<script>

import { isNullOrUndefind } from '@/utils/utils'
import {mapState,mapActions,mapMutations,mapGetters} from 'vuex'
export default {
  computed:{
        ...mapState({
       
          customer:state=>state.customer.customer,
          account:state=>state.customer.account,
        }),
        ifLogin(){
        
            return isNullOrUndefind(this.customer)&&isNullOrUndefind(this.account)
        }
    },
  data() {
    return {
    
    }
  },
  created(){
  
  },
  methods:{
    
  }
}
</script>

<style>

</style>